var { Plot } = require("../Plot.js")

var plot = new Plot(document.querySelector("#myCanvas"));
window.onresize = function () {
	plot.clean()
};

function drawPath(x, y, n, r) {//多边形
	var i, ang;
	ang = Math.PI * 2 / n; //旋转的角度
	var context = myCanvas.getContext("2d");
	// context.save();//保存状态
	context.fillStyle = 'rgba(255,0,0,.3)';//填充红色，半透明
	context.strokeStyle = 'hsl(120,50%,50%)';//填充绿色
	context.lineWidth = 1;//设置线宽
	context.translate(x, y);//原点移到x,y处，即要画的多边形中心
	context.moveTo(0, -r);//据中心r距离处画点
	context.beginPath();
	for (i = 0; i < n; i++) {
		context.rotate(ang);//旋转
		context.lineTo(0, -r);//据中心r距离处连线
	}
	context.closePath();
	context.stroke();
	context.fill();
	context.restore();//返回原始状态
}

var { initPointList } = require("../html5-canvas-particle-effect/js/points")
var list = initPointList(1000);
plot.drawList(list)
plot.reDraw =function (params) {
	this.drawList(list)
}
setInterval(function (params) {
	for (let index = 0, len = list.length; index < len; index++) {
		// const element = list[index];
		list[index].x++
		list[index].y++
	}
	plot.drawList(list)
}, 20)
canvasMv(plot.container, list, test2)

	//setTimeout("drawPath(100, 100, 5, 40)", 1500);//在100,100处画一个半径为40的五边形
	//setTimeout("drawPath(200, 100, 3, 40)",1500);//在200,100处画一个半径为40的三角形
	//setTimeout("drawPath(300, 100, 7, 40)",1500);//在300,100处画一个半径为40的七边形
	//drawPath(100, 200, 15, 40);//在100,200处画一个半径为40的十五边形
	// drawPath(200, 200, 4, 40);//在100,200处画一个半径为40的四边形